﻿<Window
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:Microsoft_Windows_Controls_Ribbon="clr-namespace:Microsoft.Windows.Controls.Ribbon;assembly=RibbonControlsLibrary"
	x:Class="XAMLTOONAnimator.MovieEditorControl"
	x:Name="MovieEditorControl1"
	Title="Frame Control Panel"
	Width="494.5" Height="151.5" Background="#FF282828" Icon="faviconFilm.png">
	<Window.Resources>
	
		<!-- Simple Button - This control sets brushes on each state. Note that these brushes must be listed above since they are static resources -->
		<Style x:Key="FirstFrameButtonStyle1" TargetType="{x:Type Button}" BasedOn="{x:Null}">
			<Setter Property="FocusVisualStyle" Value="{DynamicResource SimpleButtonFocusVisual}"/>
			<Setter Property="Background" Value="{DynamicResource NormalBrush}"/>
			<Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type Button}">
					
						<!-- We use Grid as a root because it is easy to add more elements to customize the button -->
						<Grid x:Name="Grid" Width="80" Height="80">
							<Border x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" HorizontalAlignment="Left" Width="80" Height="Auto">
								<Viewbox Margin="0" ToolTip="0" Width="80" Height="80" Stretch="Fill">
									<Grid Width="80" Height="80">
										<Rectangle Stretch="Fill" StrokeThickness="2" StrokeLineJoin="Round" Stroke="#FF000000" Fill="#FF808080" HorizontalAlignment="Left" Margin="13.42,8,0,21.333" Width="7.342" Height="Auto">
											<Rectangle.Effect>
												<DropShadowEffect Opacity="0.7"/>
											</Rectangle.Effect>
										</Rectangle>
										<Path Stretch="Fill" StrokeThickness="3" StrokeMiterLimit="2.75" Stroke="#FF000000" Fill="#FF808080" Data="F1 M 183.454,179.958L 183.333,132.667L 142.772,155.845L 183.454,179.958 Z " Margin="22.458,6.834,13.86,22.875" Width="Auto" Height="Auto">
											<Path.Effect>
												<DropShadowEffect Opacity="0.7"/>
											</Path.Effect>
										</Path>
										<!-- The bindings are useful so that the control can be parameterized without editing the template -->
										<ContentPresenter HorizontalAlignment="Left" Margin="8,0,0,4.207" VerticalAlignment="Bottom" RecognizesAccessKey="True" Content="First Frame" ContentSource=""/>
									</Grid>
								</Viewbox>
							</Border>
						
<!-- The bindings are useful so that the control can be parameterized without editing the template -->
						</Grid>
					
						<!--Each state sets a brush on the Border in the template -->
						<ControlTemplate.Triggers>
							<Trigger Property="IsKeyboardFocused" Value="true">
								<Setter Property="BorderBrush" Value="{DynamicResource DefaultedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="{DynamicResource MouseOverBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Background" Value="{DynamicResource PressedBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsEnabled" Value="true"/>
							<Trigger Property="IsEnabled" Value="false">
								<Setter Property="Background" Value="{DynamicResource DisabledBackgroundBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource DisabledBorderBrush}" TargetName="Border"/>
								<Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
		<Style x:Key="PrevFrameButtonStyle1" TargetType="{x:Type Button}" BasedOn="{x:Null}">
			<Setter Property="FocusVisualStyle" Value="{DynamicResource SimpleButtonFocusVisual}"/>
			<Setter Property="Background" Value="{DynamicResource NormalBrush}"/>
			<Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type Button}">
					
						<!-- We use Grid as a root because it is easy to add more elements to customize the button -->
						<Grid x:Name="Grid" Width="80">
							<Border x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" HorizontalAlignment="Left" Width="80" Height="Auto">
								<Viewbox Margin="0,0,-2,-2" Stretch="Fill">
									<Grid Width="78" Height="78">
										<Path Stretch="Fill" StrokeThickness="3" StrokeLineJoin="Round" Stroke="#FF000000" Fill="#FF808080" Data="F1 M 218.667,132L 190,157.333L 218.667,182L 207.021,156L 218.667,132 Z " HorizontalAlignment="Stretch" Margin="24.156,8,22.177,22.167" VerticalAlignment="Stretch" Width="Auto" Height="Auto">
											<Path.Effect>
												<DropShadowEffect/>
											</Path.Effect>
										</Path>
										<!-- The bindings are useful so that the control can be parameterized without editing the template -->
										<ContentPresenter x:Name="PrevFrmPresenter" HorizontalAlignment="Left" Margin="8,0,0,2.207" VerticalAlignment="Bottom" RecognizesAccessKey="True" Content="Prev Frame" ContentSource=""/>
									</Grid>
								</Viewbox>
							</Border>
						
<!-- The bindings are useful so that the control can be parameterized without editing the template -->
						</Grid>
					
						<!--Each state sets a brush on the Border in the template -->
						<ControlTemplate.Triggers>
							<Trigger Property="IsKeyboardFocused" Value="true">
								<Setter Property="BorderBrush" Value="{DynamicResource DefaultedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="{DynamicResource MouseOverBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Background" Value="{DynamicResource PressedBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsEnabled" Value="true"/>
							<Trigger Property="IsEnabled" Value="false">
								<Setter Property="Background" Value="{DynamicResource DisabledBackgroundBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource DisabledBorderBrush}" TargetName="Border"/>
								<Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
		<Style x:Key="PlayRevFrameButtonStyle1" TargetType="{x:Type Button}" BasedOn="{x:Null}">
			<Setter Property="FocusVisualStyle" Value="{DynamicResource SimpleButtonFocusVisual}"/>
			<Setter Property="Background" Value="{DynamicResource NormalBrush}"/>
			<Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type Button}">
					
						<!-- We use Grid as a root because it is easy to add more elements to customize the button -->
						<Grid x:Name="Grid" Width="80">
							<Border x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" HorizontalAlignment="Left" Width="80" Height="Auto">
								<Viewbox Margin="0,0,-2,-2" Stretch="Fill">
									<Grid Width="78" Height="78">
										<Path Stretch="Fill" StrokeThickness="3" StrokeMiterLimit="2.75" Stroke="#FF000000" Fill="#FF808080" Data="F1 M 263.124,182.085L 263.333,132.667L 221.25,155.84L 263.124,182.085 Z " Margin="8,8,19.68,18.167" Width="Auto" Height="Auto">
											<Path.Effect>
												<DropShadowEffect BlurRadius="3" Opacity="0.445" Direction="267"/>
											</Path.Effect>
										</Path>
										<!-- The bindings are useful so that the control can be parameterized without editing the template -->
										<ContentPresenter HorizontalAlignment="Left" Margin="28.3,0,0,2.207" VerticalAlignment="Bottom" RecognizesAccessKey="True" Content="Rev" ContentSource=""/>
									</Grid>
								</Viewbox>
							</Border>
						
<!-- The bindings are useful so that the control can be parameterized without editing the template -->
						</Grid>
					
						<!--Each state sets a brush on the Border in the template -->
						<ControlTemplate.Triggers>
							<Trigger Property="IsKeyboardFocused" Value="true">
								<Setter Property="BorderBrush" Value="{DynamicResource DefaultedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="{DynamicResource MouseOverBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Background" Value="{DynamicResource PressedBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsEnabled" Value="true"/>
							<Trigger Property="IsEnabled" Value="false">
								<Setter Property="Background" Value="{DynamicResource DisabledBackgroundBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource DisabledBorderBrush}" TargetName="Border"/>
								<Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
			<Style x:Key="PlayButtonStyle1" TargetType="{x:Type Button}" BasedOn="{x:Null}">
			<Setter Property="FocusVisualStyle" Value="{DynamicResource SimpleButtonFocusVisual}"/>
			<Setter Property="Background" Value="{DynamicResource NormalBrush}"/>
			<Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type Button}">
					
						<!-- We use Grid as a root because it is easy to add more elements to customize the button -->
						<Grid x:Name="Grid" Width="80" Height="80">
							<Border x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" HorizontalAlignment="Left" Width="80" Height="Auto">
								<Viewbox Margin="0" ToolTip="0" Width="80" Height="80" Stretch="Fill">
									<Grid Width="80" Height="80">
										<!-- The bindings are useful so that the control can be parameterized without editing the template -->
										<ContentPresenter HorizontalAlignment="Left" Margin="29.056,0,0,3.621" VerticalAlignment="Bottom" RecognizesAccessKey="True" Content="Play" ContentSource=""/>
										<Path Stretch="Fill" StrokeThickness="3" StrokeMiterLimit="2.75" Stroke="#FF000000" Fill="#FF808080" Data="F1 M 317.543,182.752L 317.333,133.333L 359.417,156.507L 317.543,182.752 Z " Margin="17.056,8,13.86,19.581" Width="Auto" Height="Auto">
											<Path.Effect>
												<DropShadowEffect Opacity="0.7"/>
											</Path.Effect>
										</Path>
									</Grid>
								</Viewbox>
							</Border>
						
<!-- The bindings are useful so that the control can be parameterized without editing the template -->
						</Grid>
					
						<!--Each state sets a brush on the Border in the template -->
						<ControlTemplate.Triggers>
							<Trigger Property="IsKeyboardFocused" Value="true">
								<Setter Property="BorderBrush" Value="{DynamicResource DefaultedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="{DynamicResource MouseOverBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Background" Value="{DynamicResource PressedBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsEnabled" Value="true"/>
							<Trigger Property="IsEnabled" Value="false">
								<Setter Property="Background" Value="{DynamicResource DisabledBackgroundBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource DisabledBorderBrush}" TargetName="Border"/>
								<Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
	<Style x:Key="NextFrameButtonStyle1" TargetType="{x:Type Button}" BasedOn="{x:Null}">
			<Setter Property="FocusVisualStyle" Value="{DynamicResource SimpleButtonFocusVisual}"/>
			<Setter Property="Background" Value="{DynamicResource NormalBrush}"/>
			<Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type Button}">
					
						<!-- We use Grid as a root because it is easy to add more elements to customize the button -->
						<Grid x:Name="Grid" Width="80" Height="80">
							<!-- The bindings are useful so that the control can be parameterized without editing the template -->
							<Border x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" HorizontalAlignment="Left" Width="80" Height="Auto">
								<Viewbox Margin="0" ToolTip="0" Width="80" Height="80" Stretch="Fill">
									<Grid Width="80" Height="80">
										<!-- The bindings are useful so that the control can be parameterized without editing the template -->
										<Path Stretch="Fill" StrokeThickness="3" StrokeLineJoin="Round" Stroke="#FF000000" Fill="#FF808080" Data="F1 M 362,132.667L 390.667,158L 362,182.667L 373.646,156.667L 362,132.667 Z " HorizontalAlignment="Stretch" Margin="24.333,0,24,19" VerticalAlignment="Bottom" Width="Auto" Height="53">
											<Path.Effect>
												<DropShadowEffect Opacity="0.695" ShadowDepth="3" Direction="200"/>
											</Path.Effect>
										</Path>
<!-- The bindings are useful so that the control can be parameterized without editing the template -->
										<ContentPresenter HorizontalAlignment="Left" Margin="8,0,0,4.207" VerticalAlignment="Bottom" RecognizesAccessKey="True" Content="Next Frame" ContentSource=""/>
									</Grid>
								</Viewbox>
							</Border>
						
<!-- The bindings are useful so that the control can be parameterized without editing the template -->
						</Grid>
					
						<!--Each state sets a brush on the Border in the template -->
						<ControlTemplate.Triggers>
							<Trigger Property="IsKeyboardFocused" Value="true">
								<Setter Property="BorderBrush" Value="{DynamicResource DefaultedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="{DynamicResource MouseOverBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Background" Value="{DynamicResource PressedBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsEnabled" Value="true"/>
							<Trigger Property="IsEnabled" Value="false">
								<Setter Property="Background" Value="{DynamicResource DisabledBackgroundBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource DisabledBorderBrush}" TargetName="Border"/>
								<Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
			<Style x:Key="LastFrameButtonStyle1" TargetType="{x:Type Button}" BasedOn="{x:Null}">
			<Setter Property="FocusVisualStyle" Value="{DynamicResource SimpleButtonFocusVisual}"/>
			<Setter Property="Background" Value="{DynamicResource NormalBrush}"/>
			<Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type Button}">
					
						<!-- We use Grid as a root because it is easy to add more elements to customize the button -->
						<Grid x:Name="Grid" Width="80" Height="80">
							<Border x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" HorizontalAlignment="Left" Width="80" Height="Auto">
								<Viewbox Margin="0" ToolTip="0" Width="80" Height="80" Stretch="Fill">
									<Grid Width="80" Height="80">
										<!-- The bindings are useful so that the control can be parameterized without editing the template -->
										<ContentPresenter HorizontalAlignment="Left" Margin="8,0,0,4.207" VerticalAlignment="Bottom" RecognizesAccessKey="True" Content="Last Frame" ContentSource=""/>
										<Grid Margin="11.116,9.166,13.86,20.167">
											<Path Stretch="Fill" StrokeThickness="3" StrokeMiterLimit="2.75" Stroke="#FF000000" Fill="#FF808080" Data="F1 M 397.213,180.625L 397.333,133.333L 437.895,156.511L 397.213,180.625 Z " HorizontalAlignment="Right" Margin="0,0,11.342,0" VerticalAlignment="Bottom" Width="43.682" Height="50.291" RenderTransformOrigin="0.295,0.465">
												<Path.Effect>
													<DropShadowEffect BlurRadius="3" ShadowDepth="4" Opacity="0.695" Direction="-154"/>
												</Path.Effect>
											</Path>
											<Rectangle Stretch="Fill" StrokeThickness="2" StrokeLineJoin="Round" Stroke="#FF000000" Fill="#FF808080" HorizontalAlignment="Right" Margin="0,0,0,-0.376" VerticalAlignment="Bottom" Width="7.342" Height="50.667"/>
										</Grid>
									</Grid>
								</Viewbox>
							</Border>
						
<!-- The bindings are useful so that the control can be parameterized without editing the template -->
						</Grid>
					
						<!--Each state sets a brush on the Border in the template -->
						<ControlTemplate.Triggers>
							<Trigger Property="IsKeyboardFocused" Value="true">
								<Setter Property="BorderBrush" Value="{DynamicResource DefaultedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="{DynamicResource MouseOverBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsPressed" Value="true">
								<Setter Property="Background" Value="{DynamicResource PressedBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" TargetName="Border"/>
							</Trigger>
							<Trigger Property="IsEnabled" Value="true"/>
							<Trigger Property="IsEnabled" Value="false">
								<Setter Property="Background" Value="{DynamicResource DisabledBackgroundBrush}" TargetName="Border"/>
								<Setter Property="BorderBrush" Value="{DynamicResource DisabledBorderBrush}" TargetName="Border"/>
								<Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
							</Trigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>


		
	
	</Window.Resources>

	<Grid x:Name="LayoutRoot" Margin="0,0,-8,0" VerticalAlignment="Top">
		<Button x:Name="First_Frame" HorizontalAlignment="Left" Margin="0,3.586,0,0" Style="{DynamicResource FirstFrameButtonStyle1}" Width="80" Content="Button" VerticalAlignment="Top"/>
		<Button x:Name="PreviousFrame" HorizontalAlignment="Left" Margin="80,3.586,0,0" Style="{DynamicResource PrevFrameButtonStyle1}" Width="80" Content="Button" MouseLeftButtonUp="FirstFrameClick" VerticalAlignment="Top" Height="80"/>
		<Button x:Name="PlayReverse" Margin="160,3.586,0,0" Content="Button" Style="{DynamicResource PlayRevFrameButtonStyle1}" HorizontalAlignment="Left" Width="80" VerticalAlignment="Top" Height="80"/>
		<Button x:Name="PlayBtn" Margin="240,3.586,166.5,0" Style="{DynamicResource PlayButtonStyle1}" Content="Button" VerticalAlignment="Top"/>
		<Button x:Name="NextFrameBtn" HorizontalAlignment="Right" Margin="0,3.586,86.5,0" Style="{DynamicResource NextFrameButtonStyle1}" Width="80" VerticalAlignment="Top"/>
		<Button x:Name="LastFrameBtn" HorizontalAlignment="Right" Margin="0,3.586,6.5,0" Style="{DynamicResource LastFrameButtonStyle1}" Width="80" Content="Button" VerticalAlignment="Top"/>
		<Canvas Margin="0,0,6.5,-25" VerticalAlignment="Bottom" Height="21">
			<Slider x:Name="Frame_Slider" Width="364" Height="21" Canvas.Left="116" Maximum="100" SmallChange="10" TickFrequency="10" TickPlacement="Both"/>
			<Label Width="50.5" Height="21" Content="Frame #:" Foreground="#FFE8E8E8" Margin="0,3,0,0"/>
			<TextBox x:Name="FrameNo" Width="43" Height="21" Text="0" TextWrapping="Wrap" Canvas.Left="54.5"/>
		</Canvas>
	</Grid>
</Window>